<template>
  <div>
    <!-- 头部tab -->
    <!-- <div class="top_tab">
      <div class="left" @click="back()">
        <img  src="../assets/order_center/shangs.png">
      </div>
      <span>修改密码</span>
      <div class="right">
      </div>
    </div> -->
		<div class="list">
			<yd-cell-group>
				<yd-cell-item>
					<span slot="left">请输入当前登录密码：</span>
					<input slot="right" type="password" v-model="dqpassword" placeholder="请输入当前登录密码">
				</yd-cell-item>
			</yd-cell-group>
			<yd-cell-group>
				<yd-cell-item>
					<span slot="left">设置新密码：</span>
					<input slot="right" type="password" v-model="password" placeholder="确认新密码">
				</yd-cell-item>
			</yd-cell-group>
			<yd-cell-group>
				<yd-cell-item>
					<span slot="left">确认新密码：</span>
					<input slot="right" type="password" v-model="okpassword" placeholder="确认新密码">
				</yd-cell-item>
			</yd-cell-group>
		</div>
		<div class="txt">
			<span>必须是6-20英文字母、数字或符号（除空格），且字母、数字和标点符号至少包含两种</span>
		</div>
    <div class="btn">
			<button class="next" @click="names()">下一步</button>
		</div>
	</div>
</template>

<script>
import Vue from 'vue';
import {CellGroup, CellItem} from 'vue-ydui/dist/lib.rem/cell';
Vue.component(CellGroup.name, CellGroup);
Vue.component(CellItem.name, CellItem);
export default {
  name: 'setpwd',
  data () {
    return {
     index:0,
		 isshow:false,
		 dqpassword:'',
		 password:'',
		 okpassword:''
    }
  },
  methods:{
    back: function() {
      this.$router.go(-1);
		}, 
		//下一步
		names(){
			let self = this;
			let url = "/api/login/updatepassword";
			if(!this.dqpassword){
				this.$dialog.toast({mes:"请输当前密码"});
				return
			}  
			if(!this.password){
				this.$dialog.toast({mes:"请输新密码"});
				return
			}
			if(!this.okpassword){
				this.$dialog.toast({mes:"请确认新密码"});
				return
			}
			if(this.password!=this.okpassword){
				this.$dialog.toast({mes:"两次密码不一致"});
				return
			}
			self.httpPost(url,{user_id:this.myid,token:this.token,password:this.okpassword,oldPassword:this.dqpassword},function(res) {
				if (res.code == 200) { 
					self.$dialog.toast({mes:"修改成功"});
					setTimeout(() => {
						self.$router.push("/login"); 
					}, 1000); 
				}else{
					self.$dialog.toast({mes:res.msg});
        }
      })
	},

	},
		created(){
    document.title = "修改密码";
    this.token = localStorage.getItem('mytoken');
		this.myid = localStorage.getItem('myid');
  },
}
</script>


<style scoped>
.top_tab{
  width:100%;
  padding:.2rem .3rem;
  background: #FFF;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: .01rem .01rem .06rem #ddd;
  margin-bottom: .2rem;
}
.top_tab span{
  color:#333;
  font-size: .36rem;
}
.top_tab .right{
	width: 1rem;
	display: flex;
	justify-content: space-between;
}
.top_tab  img{
  width:.43rem;
}
.list{
	width:100%;
	padding: 0 .3rem;
	background: #FFF;
}

.btn{
	width:100%;
	display: flex;
	justify-content: center;
	margin-top: .4rem;
}
.btn .next{
	width: 90%;
	height:.90rem;
	background: #e63f3f;
	border: none;
	border-radius: 10px;
	font-size: .32rem;
	color:#FFF;
}
.txt{
	width:100%;
	display: flex;
	justify-content: center;
	padding: .1rem .3rem;
}
.txt span{
	color: #999;
	font-size: .25rem;
	line-height: .4rem;
}
</style>

<style>
.yd-cell:after {
	height:0!important;
}
</style>

